<template>
  <div class="container">
    <div class="header">
      <el-input
        style="width:200px"
        v-model="search.serial_code"
        placeholder="请输入要票单号"
        clearable
      ></el-input>
      <el-select
        clearable
        v-model="inside.value"
        :multiple="false"
        filterable
        remote
        center
        reserve-keyword
        placeholder="请选择供应商"
        :remote-method="insideRemoteMethod"
        :loading="inside.loading"
      >
        <el-option
          v-for="item in inside.list"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        ></el-option>
      </el-select>
      <el-select v-model="search.status" multiple placeholder="请选择状态">
        <el-option
          v-for="item in options"
          :key="item.id"
          :label="item.name"
          :value="item.id"
        ></el-option>
      </el-select>
      <el-date-picker
        value-format="yyyy-MM-dd"
        v-model="date"
        class="hidden-xs-only"
        type="daterange"
        :clearable="false"
        range-separator="至"
        start-placeholder="开始日期"
        end-placeholder="结束日期"
      ></el-date-picker>
      <el-button type="primary" icon="el-icon-search" @click="handleSearch()"
        >查询</el-button
      >
      <el-button type="danger" icon="el-icon-delete" @click="empty()"
        >清空</el-button
      >
      <el-button type="info" icon="el-icon-tickets" @click="derive()"
        >导出</el-button
      >
      <el-button type="info" icon="el-icon-tickets" @click="deriveTicket()"
        >要票汇总导出</el-button
      >
      <el-button type="warning" icon="el-icon-sort" @click="match()"
        >发票自动匹配</el-button
      >
      <el-button type="danger" icon="el-icon-delete" @click="remove"
        >删除要票单</el-button
      >
    </div>
    <el-table
      max-height="600"
      :data="tableData"
      border
      @selection-change="handleSelectionChange"
      style="width: 100%"
      empty-text="暂无数据"
    >
      <el-table-column
        type="selection"
        width="50"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="serial_code"
        label="单号"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="supplier_name"
        label="供应商"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="statusMsg"
        label="状态"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="start_date"
        label="开始时间"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="end_date"
        label="结束时间"
        align="center"
      ></el-table-column>
      <el-table-column label="操作" width="280" align="center">
        <template slot-scope="scope">
          <el-button
            type="info"
            size="mini"
            icon="el-icon-warning-outline"
            @click="handleEdit(scope)"
            >详情</el-button
          >
          <el-button
            size="mini"
            v-if="scope.row.status == 2"
            type="warning"
            icon="el-icon-finished"
            @click="compulsoryBtn(scope)"
            >强制完成</el-button
          >
          <el-button
            size="mini"
            v-if="scope.row.status == 2"
            type="success"
            icon="el-icon-sort"
            @click="synchronizeBtn(scope)"
          >
            同步发票信息</el-button
          >
          <!-- <el-button
            type="primary"
            v-if="!(scope.row.status == 4 || acc_type == 1 || acc_type == 6)"
            size="mini"
            icon="el-icon-edit"
            @click="audit(scope)"
            >审核</el-button
          >
          <el-button
            type="warning"
            v-if="
              acc_type != 1 &&
                acc_type != 6 &&
                (scope.row.status == 2 || scope.row.status == 3)
            "
            size="mini"
            icon="el-icon-edit"
            @click="strongReview(scope)"
            >强审</el-button
          > -->
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页 -->
    <pagination
      @page="handleSizeChange"
      @pagesize="handleCurrentChange"
      :pageData="pageData"
    ></pagination>
    <billSuperTicketDetails :dialog="dialog"></billSuperTicketDetails>
  </div>
</template>
<script>
import BillSuperTicketDetails from "@/components/bill/billSuperTicketDetails";
import Pagination from "@/components/pagination";
import { getToken } from "@/utils/auth";
import { getInfo } from "@/api/user";
import { getnowDate } from "@/utils/index";
import {
  ticketSmkList,
  getSupplierOptions,
  examineSmkTicket,
  compelSmkt,
  autoSmkMatching,
  delTicketSmk,
  compelSmk,
  syncTicketSmk
} from "@/api/bill";
// import { supplierList } from "@/api/supplier/supplierList";
export default {
  components: {
    pagination: Pagination,
    billSuperTicketDetails: BillSuperTicketDetails
  },
  data() {
    return {
      //页面数据
      tableData: [],
      search: {
        serial_code: "",
        status: [],
        start_time: "",
        end_time: ""
      },
      date: [],
      //默认时间
      normal_startime: "",
      normal_endtime: "",
      options: [
        // { id: 1, name: "已生成未审核" },
        { id: 2, name: "未开发票" },
        { id: 3, name: "已开部分开票" },
        { id: 4, name: "已开发票" }
      ],
      inside: {
        innerVisible: false,
        options: [],
        value: "",
        list: [],
        loading: false
      },
      acc_type: null,
      supplier_code: "",
      multipleSelection: [],
      //dialog信息
      dialog: {
        dialogVisible: false,
        id: ""
      },
      //分页
      pageData: {
        pageSizes: [10, 20],
        pageSize: 10,
        page: 1,
        total: null,
        layout: "total, sizes, prev, pager, next, jumper"
      }
    };
  },
  created() {
    //页面数据
    this.getData();
    this.getInfos();
    this.getSupplierList();
    this.search.start_time = this.normal_startime;
    this.search.end_time = this.normal_endtime;
    if (this.normal_startime) {
      this.date.push(this.search.start_time);
    }
    if (this.normal_endtime) {
      this.date.push(this.search.end_time);
    }
  },
  methods: {
    //同步发票
    synchronizeBtn(scope) {
      let data = {
        id: scope.row.id
      };
      this.$confirm("是否同步发票?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          syncTicketSmk(data).then(res => {
            if (res.code == 0) {
              this.getData();
              this.$message({
                type: "success",
                message: res.msg || res.message
              });
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消"
          });
        });
    },
    // 强制完成
    compulsoryBtn(scope) {
      let data = {
        id: scope.row.id
      };
      this.$confirm("是否强制完成?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          compelSmk(data).then(res => {
            if (res.code == 0) {
              this.getData();
              this.$message({
                type: "success",
                message: res.msg || res.message
              });
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消"
          });
        });
    },
    //页面数据
    getData() {
      let data = {
        start_date: this.search.start_time,
        end_date: this.search.end_time,
        limit: this.pageData.pageSize,
        page: this.pageData.page,
        serial_code: this.search.serial_code,
        status: this.search.status.join(","),
        supplier_code: this.inside.value
      };
      ticketSmkList(data)
        .then(res => {
          res.data.paginate.data.forEach(prop => {
            switch (prop.status) {
              case 1:
                prop.statusMsg = "已生成";
                break;
              case 2:
                prop.statusMsg = "未开发票";
                break;
              case 3:
                prop.statusMsg = "已开部分发票";
                break;
              case 4:
                prop.statusMsg = "已开发票";
                break;
            }
          });
          this.tableData = res.data.paginate.data;
          this.pageData.total = res.data.paginate.total;
        })
        .catch(err => {});
    },
    getInfos() {
      getInfo().then(res => {
        if (res.code == 0) {
          this.acc_type = res.data.admin_info.acc_type;
        }
      });
    },
    // 嵌套搜索供应商数据
    insideRemoteMethod(query) {
      if (query !== "") {
        this.getSupplierList(query);
      } else {
        this.inside.options = [];
      }
    },
    //获取供应商数据
    getSupplierList(query = "") {
      let data = {
        supplier_code: query,
        page: 1,
        limit: 50
      };
      this.inside.loading = true;
      getSupplierOptions(data).then(res => {
        this.inside.list = res.data.options.data.map(item => {
          return { value: `${item.code}`, label: `${item.name}(${item.code})` };
        });
        this.inside.loading = false;
      });
    },
    //编辑
    handleEdit(scope) {
      this.dialog.dialogVisible = true;
      this.dialog.dialogType = "edit";
      this.dialog.id = scope.row.id;
    },
    // 审核
    audit(scope) {
      let data = {
        id: scope.row.id
      };
      this.$confirm("是否审核该条信息?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          examineSmkTicket(data).then(res => {
            if (res.code == 0) {
              this.getData();
              this.$message({
                type: "success",
                message: res.msg || res.message
              });
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消"
          });
        });
    },
    //  强核
    strongReview(scope) {
      let data = {
        id: scope.row.id
      };
      this.$confirm("是否强审该条信息?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          compelSmkt(data).then(res => {
            if (res.code == 0) {
              this.getData();
              this.$message({
                type: "success",
                message: res.msg || res.message
              });
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消"
          });
        });
    },
    //发票匹配
    match() {
      let data = {
        supplier_code: this.inside.value
      };
      this.$confirm("是否商超发票匹配?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          autoSmkMatching(data).then(res => {
            if (res.code == 0) {
              this.getData();
              this.$message({
                type: "success",
                message: res.msg || res.message
              });
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消"
          });
        });
    },
    // 搜索
    handleSearch() {
      if (this.date.length > 0) {
        this.search.start_time = this.date[0];
        this.search.end_time = this.date[1];
      }
      this.pageData.total = null;
      this.pageData.page = 1;
      this.getData();
    },
    //清空
    empty() {
      this.date = [];
      this.date.push(this.normal_startime);
      this.date.push(this.normal_endtime);
      this.search = {
        serial_code: "",
        status: [],
        start_time: this.normal_startime,
        end_time: this.normal_endtime
      };
      this.inside = {
        innerVisible: false,
        options: [],
        value: "",
        list: [],
        loading: false
      };
    },
    // 导出
    derive() {
      this.$confirm("是否导出?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          let link = document.createElement("a");
          let ids = "";
          if (this.multipleSelection.length > 0) {
            let idsArr = [];
            this.multipleSelection.forEach(res => {
              idsArr.push(res.id);
            });
            ids = idsArr.join(",");
          }
          if (this.date.length > 0) {
            this.search.start_time = this.date[0];
            this.search.end_time = this.date[1];
          }
          link.href =
            this.$axios.defaults.baseURL +
            "/api/Invoicexd/exportSmkTicket?token=" +
            getToken() +
            "&serial_code=" +
            this.search.serial_code +
            "&supplier_code=" +
            this.inside.value +
            "&start_date=" +
            this.search.start_time +
            "&end_date=" +
            this.search.end_time +
            "&status=" +
            this.search.status.join(",") +
            "&ids=" +
            ids;
          link.click();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消导出"
          });
        });
    },
    deriveTicket() {
      this.$confirm("是否导出?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          let link = document.createElement("a");
          let ids = "";
          if (this.multipleSelection.length > 0) {
            let idsArr = [];
            this.multipleSelection.forEach(res => {
              idsArr.push(res.id);
            });
            ids = idsArr.join(",");
          }
          if (this.date.length > 0) {
            this.search.start_time = this.date[0];
            this.search.end_time = this.date[1];
          }
          link.href =
            this.$axios.defaults.baseURL +
            "/api/Invoicexd/exportSummaryTicketSmk?token=" +
            getToken() +
            "&serial_code=" +
            this.search.serial_code +
            "&supplier_code=" +
            this.inside.value +
            "&start_date=" +
            this.search.start_time +
            "&end_date=" +
            this.search.end_time +
            "&status=" +
            this.search.status.join(",") +
            "&ids=" +
            ids;
          link.click();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消导出"
          });
        });
    },
    // 删除要票单
    remove() {
      if (this.multipleSelection.length > 0) {
        let ids = [];
        this.multipleSelection.forEach(res => {
          ids.push(res.id);
        });
        let data = {
          supplier_code: this.inside.value,
          idstr: ids.join(",")
        };
        this.$confirm("是否删除要票单?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            delTicketSmk(data).then(res => {
              if (res.code == 0) {
                this.getData();
                this.$message({
                  type: "success",
                  message: res.msg
                });
              }
            });
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消"
            });
          });
      } else {
        this.$message({
          type: "info",
          message: "请勾选内容"
        });
      }
    },
    //每页多少条
    handleCurrentChange(val) {
      this.pageData.page = 1;
      this.pageData.pageSize = val;
      this.getData();
    },
    //选取页数
    handleSizeChange(page) {
      this.pageData.page = page;
      this.getData();
    },
    //勾选
    handleSelectionChange(val) {
      this.multipleSelection = val;
    }
  }
};
</script>
<style scoped>
.header {
  margin-bottom: 10px;
}
.search {
  width: 200px;
  margin-right: 10px;
}
</style>
